<template>
    <div>
        <div>
            姓名:{{ p.name }}
        </div>
        <div>
            年龄:{{ p.age }} 
            <button @click="p.age++">+</button>
        </div>
        <div>
            存款:{{ p.moneny }}
            <button @click="p.moneny--">-</button>
            <button @click="p.moneny++">+</button>
        </div>
    </div>
</template>
<script lang='ts' setup>
import {reactive,watch,computed} from 'vue'
const p=reactive({
    name:'giles',
    age:18,
    moneny:1000
})
//const newP=computed(()=>({...p}))
watch(()=>p.moneny,(newval,oldaval)=>{
    console.log('newval',newval,'oldval',oldaval); 
})

</script>
<style lang='scss' scoped>
</style>